import React from 'react'
import axios from 'axios'
import propTypes from 'prop-types'
import {Card, WhiteSpace, WhiteBlank, WingBlank} from 'antd-mobile' 
import {withRouter} from 'react-router-dom'

@withRouter

class UserCard extends React.Component {
    static propTypes={
        userlist:propTypes.array.isRequired
    }
    handleClick(v){
       this.props.history.push(`/chat/${v._id}`) 
    }
    componentDidMount() {
        
    }
    render() {
        return (
            <WingBlank>
                {this
                    .props
                    .userlist
                    .map(v => (v.avatar
                        ? (<Card  className='card_list' key={v._id} onClick={()=>{this.handleClick(v)}}>
                                <Card.Header   extra={<span>{v.title}</span>} title={v.user} thumb={require(`../img/${v.avatar}.jpg`)}></Card.Header>
                                <Card.Body>{v.desc.split('n').map(v=>(
                                    <div key={v}>{v}</div>
                                ))}</Card.Body>
                            </Card>
                    ): null))}
            </WingBlank>
        )
    }
}

export default UserCard